import Taro, {Component} from '@tarojs/taro'
import {View, Text, ScrollView} from '@tarojs/components'
import Lpmask from "../Lpmask"
import {AtIcon} from "taro-ui"

export default class dialog extends Component {
  setCloseClick() {
    this.props.onCloseClick && this.props.onCloseClick()
  }

  render() {
    return (
      <View style={{
        position: "fixed",
        left: "0px",
        right: "0px",
        bottom: "0px",
        top: "0px",
        display: this.props.show ? "flex" : "none",
        alignItems: "center",
        justifyContent: "center"
      }}>
        <Lpmask show={(this.props.mask && this.props.show)}> </Lpmask>
        <View style={{background: "#ffffff", zIndex: 9, borderTopLeftRadius: "5px", borderTopRightRadius: "5px"}}>
          <View style={{
            height: "36px",
            background: "#cc0033",
            borderTopLeftRadius: "5px",
            borderTopRightRadius: "5px",
            display: "flex"
          }}>
            <View style={{flex: 1}}>
              {this.props.renderHead}
            </View>
            <View onClick={this.setCloseClick.bind(this)}
                  style={{width: "36px", display: "flex", alignItems: "center", justifyContent: "center"}}>
              <AtIcon prefixClass='icon' value='close' size='20' color='#ffffff'></AtIcon>
            </View>
          </View>


          <ScrollView scrollY={true} style={{
            width: this.props.bodywidth ? this.props.bodywidth : "300px",
            height: this.props.bodyheight ? this.props.bodyheight : "200px"
          }}>

            {this.props.renderBody}

          </ScrollView>


          <View>
            {this.props.renderBtn}
          </View>


        </View>
      </View>
    )
  }
}


